import { asyncRoutes, constantRoutes } from '@/router'
export default {
  namespaced: true,

  state: {
    // !#1 所有的路由信息（静态的和动态的）
    routes: constantRoutes || []
  },

  mutations: {
    // !#3 设置 routes 的 mutation
    setRoutes(state, otherRoutes) {
      // 如果退出的时候没有把 routes 清空，下一个用户会受到上一个用户的影响
      // state.routes.push(...otherRoutes, { path: '*', redirect: '/404', hidden: true })
      // 下面写法比较严谨，每次都会给一份新的数据
      state.routes = [
        ...constantRoutes,
        ...otherRoutes,
        // 最后这个 404 不加也行，因为侧边栏也不需要展示 404
        { path: '*', redirect: '/404', hidden: true }
      ]
    }
  },

  actions: {
    // 外界在触发 filterRoutes 的时候给我传递过来【后端返回的标识】，就是 menus
    async filterRoutes(context, menus) {
      // menus => ['employees', 'settings', 'departments']
      const otherRoutes = asyncRoutes.filter(item => {
        // !注意，item.children[0].name 一定要和后端返回的表示保持一致
        return menus.includes(item.children[0].name)
      })

      // !#2 把筛选出来的动态路由也往 vuex 里面存一份，目的是为了给侧边栏使用
      context.commit('setRoutes', otherRoutes)
      // 在 dispatch filterRoutes action 的时候，就可以拿到 return 的结果
      return otherRoutes
    }
  }
}

